<html  xmlns:th="http://www.thymeleaf.org"
       xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <meta name="viewport" content="width=device-width,initial-scale=1"/>
    <meta charset="utf-8"/>
    <title>米塔云平台管理系统</title>
    <link href="../plugins/bootstrap/bootstrap.min.css" rel="stylesheet"/>
    <link href="../plugins/bootstrapValidator/bootstrapValidator.min.css" rel="stylesheet">
    <link href="../plugins/font-awesome/css/all.min.css" rel="stylesheet"/>
    <link href="../customize/css/iconfont.css" rel="stylesheet">
    <link href="../customize/css/content.css" rel="stylesheet"/>
</head>
<body>
<div class="m-3">
    <div class="custom-section">
        <nav class="mb-3">
            <ol class="breadcrumb">
                <li class="breadcrumb-item"><i class="iconfont icon-xiaolan12"></i> 银行管理</li>
                <li class="breadcrumb-item active"><i class="iconfont icon-xiaolan14"></i> 银行信息管理</li>
            </ol>
        </nav>
        <div class="d-flex align-items-center justify-content-between">
            <div>
                <div shiro:hasAnyPermissions="bank:info:view,bank:info:opera" class="input-group mb-3">
                    <input type="text" class="form-control" placeholder="快捷查询" id="searchValue">
                    <div class="input-group-append">
                        <button class="btn btn-primary" type="button" onclick="loadBankList()"><i
                                class="iconfont icon-dituyechaxun"></i></button>
                    </div>
                </div>
            </div>
            <div>
                <button shiro:hasPermission="bank:info:opera" class="btn btn-primary" type="button" onclick="addBank()"><i class="fa fa-plus"></i> 添加银行
                </button>
            </div>
        </div>
        <table class="table table-striped table-bordered table-center" id="bank_list"></table>
        <div id="page" class="page_div"></div>
    </div>
</div>
<!-- Modal -->
<div shiro:hasPermission="bank:info:opera" class="modal fade" id="bankInfoModal" data-backdrop="static" tabindex="-1">
    <div class="modal-dialog modal-dialog-centered">
        <form class="modal-content text-body" id="bankInfoForm">
            <div class="modal-header">
                <div class="modal-title"><i class="iconfont icon-juxing"></i><span id="modal_title">银行信息管理</span></div>
                <button type="button" class="close" data-dismiss="modal">
                    <span>&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="text-secondary font-p12 mb-2">注：带<span class="form-required">*</span><span class="ml-3"></span>标识的为必填项</div>
                <input type="text" name="id" id="id" hidden>
                <input type="text" name="type" id="type" value="1" hidden>
                <div class="form-group row">
                    <label class="col-sm-3 col-form-label" for="name">银行名称<span class="form-required">*</span></label>
                    <div class="col-sm-8">
                        <input class="form-control" type="text" name="name" id="name">
                    </div>
                </div>
                <div class="row">
                    <label class="col-sm-3 col-form-label" for="province">位置<span class="form-required">*</span></label>
                    <div class="form-group col-sm-8 mb-2">
                        <select class="form-control" name="province" id="province"
                                onchange="getCity(getSelectValue($('#province')),$('#city'));"></select>
                    </div>
                    <div class="form-group offset-sm-3 col-sm-8 mb-2">
                        <select class="form-control" name="city" id="city"></select>
                    </div>
                    <div class="form-group offset-sm-3 col-sm-8">
                        <textarea class="form-control" name="address" id="address" rows="3"
                                  placeholder="输入详细地址"></textarea>
                    </div>
                </div>
                <div class="form-group row">
                    <label class="col-sm-3 col-form-label">logo</label>
                    <div class="col-sm-8">
                        <a class="image-upload-area text-center d-flex align-items-center justify-content-center"
                           href="##" onclick="$('#add_file_hide').click()">
                            <img id="img_load_area" src="../customize/images/icon/image-upload.png" alt="">
                        </a>
                        <input type="file" name="logoFile" id="add_file_hide" hidden>
                    </div>
                </div>
                <div class="form-group row">
                    <input type="text" id="area" name="area" hidden>
                    <label class="col-sm-3 col-form-label" for="areaDisplay">权限区域<span class="form-required">*</span></label>
                    <div class="col-sm-8">
                        <input class="form-control" type="text" id="areaDisplay">
                        <ul class="list-group" id="listGroup1" style="display: none;"></ul>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
                <button type="submit" class="btn btn-primary">提交保存</button>
            </div>
        </form>
    </div>
</div>

<!-- 查看大图modal -->
<div class="modal fade" id="viewImageModal" tabindex="-1">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content text-body">
            <div class="modal-header">
                <div class="modal-title"><i class="iconfont icon-juxing"></i> 查看大图</div>
                <button type="button" class="close" data-dismiss="modal">
                    <span>&times;</span>
                </button>
            </div>
            <div class="modal-body font-p14">
                <img class="img-fluid" id="img_preview_area" src="" alt="" style="width:100%;">
            </div>
        </div>
    </div>
</div>
</body>
<script src="../plugins/jquery-3.4.1.min.js"></script>
<script src="../plugins/bootstrap/bootstrap.bundle.min.js"></script>
<script src="../plugins/bootstrapValidator/bootstrapValidator.min.js"></script>
<script src="../plugins/bootstrapValidator/zh_CN.js"></script>
<script src="../plugins/alert.js"></script>
<script src="../plugins/paging.js"></script>
<script src="../customize/js/common.js"></script>
<script src="../customize/js/CommonUtils.js"></script>
<script src="../customize/js/customModalV2.js"></script>
<script src="../customize/js/area.js"></script>
<script src="../customize/js/bankInfoManagement.js"></script>
<script>
    var bankInfoView=false;
    var bankInfoOpera=false;
    var label = ['order', 'name', 'position', 'logo', 'areaDisplay'];
    var title = ['#', '银行名称', '位置', 'logo', '权限区域'];
</script>
<shiro:hasPermission name="bank:info:view">
    <script>
        bankInfoView =true;
    </script>
</shiro:hasPermission>
<shiro:hasPermission name="bank:info:opera">
    <script>
        bankInfoOpera =true;
        label.push('opera');
        title.push('操作');
    </script>
</shiro:hasPermission>
</html>